﻿<phone:PhoneApplicationPage 
    x:Class="BitcoinMarket.NetworkStatusChartDetail"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:chart="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Chart"
    xmlns:chartEngine="clr-namespace:Telerik.Charting;assembly=Telerik.Windows.Controls.Chart"
    xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Primitives"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    Background="White"
    SupportedOrientations="PortraitOrLandscape" Orientation="Landscape"
    mc:Ignorable="d" d:DesignHeight="768" d:DesignWidth="480"
    shell:SystemTray.IsVisible="True" OrientationChanged="PhoneApplicationPage_OrientationChanged" Loaded="PhoneApplicationPage_Loaded">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel Background="#FFF7931A" Grid.Row="0" MaxHeight="130">
            <StackPanel x:Name="TitlePanel" Margin="12,17,0,28">
                <TextBlock Margin="12, 10, 0, -10" x:Name="ApplicationTitle" Foreground="White" Text="{Binding Path=LocalizedResources.AppTitleCapital, Source={StaticResource LocalizedStrings}}" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock x:Name="PageTitle" Foreground="White" Text="{Binding ChartName}" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
            </StackPanel>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <!--ProgressBar Margin="0, 15, 0, 0" Grid.Row="0" Visibility="Collapsed" IsIndeterminate="true" x:Name="NetworkStatusPrograssBar" Style="{StaticResource CustomIndeterminateProgressBar}" Foreground="#F7931A" /-->
            <chart:RadCartesianChart Grid.Row="0" Margin="0, 0, 0, 0" x:Name="DataChart" BorderThickness="0" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" >
                <chart:RadCartesianChart.Grid>
                    <chart:CartesianChartGrid MajorLinesVisibility="XY">
                        <chart:CartesianChartGrid.MajorXLineStyle>
                            <Style TargetType="Line">
                                <Setter Property="Shape.Stroke" Value="#FF4D4D4D" />
                            </Style>
                        </chart:CartesianChartGrid.MajorXLineStyle>
                        <chart:CartesianChartGrid.MajorYLineStyle>
                            <Style TargetType="Line">
                                <Setter Property="Shape.Stroke" Value="#FF4D4D4D" />
                            </Style>
                        </chart:CartesianChartGrid.MajorYLineStyle>
                    </chart:CartesianChartGrid>
                </chart:RadCartesianChart.Grid>
                <chart:RadCartesianChart.Behaviors>
                    <chart:ChartPanAndZoomBehavior ZoomMode="Horizontal" PanMode="Horizontal"/>
                </chart:RadCartesianChart.Behaviors>
                <chart:RadCartesianChart.HorizontalAxis>
                    <chart:DateTimeCategoricalAxis x:Name="HorizontalAxis" ShowLabels="True" LabelFitMode="Rotate" BorderBrush="#FF4D4D4D" 
                                           DateTimeComponent="Day" LastLabelVisibility="Visible" MajorTickInterval="40" PlotMode="OnTicks" Foreground="#FF4D4D4D" FontSize="14" LineStroke="#FF4D4D4D" LineThickness="2" />
                </chart:RadCartesianChart.HorizontalAxis>
                <chart:RadCartesianChart.VerticalAxis>
                    <chart:LinearAxis Minimum="{Binding Min}" Maximum="{Binding Max}" ShowLabels="True" LastLabelVisibility="Visible" Title="{Binding YAxisTitle}" RangeExtendDirection="Both" Foreground="#FF4D4D4D" FontSize="14" LineStroke="#FF4D4D4D" LineThickness="2" />
                </chart:RadCartesianChart.VerticalAxis>

                <chart:LineSeries x:Name="DataChartSeries" ItemsSource="{Binding ChartData}" Stroke="#F7931A" StrokeThickness="3">
                    <chart:LineSeries.CategoryBinding>
                        <chart:PropertyNameDataPointBinding PropertyName="ShortDate" />
                    </chart:LineSeries.CategoryBinding>
                    <chart:LineSeries.ValueBinding>
                        <chart:PropertyNameDataPointBinding PropertyName="Value" />
                    </chart:LineSeries.ValueBinding>
                </chart:LineSeries>
            </chart:RadCartesianChart>
        </Grid>

        <telerikPrimitives:RadWindow PlacementTarget="{Binding ElementName=LayoutRoot}" Width="460" MinHeight="50" Placement="BottomCenter" x:Name="InfoLayer" IsAnimationEnabled="True" Tap="InfoLayer_Tap">
            <Grid Background="Black" Opacity="0.75" Tap="InfoLayer_Tap">
                <TextBlock x:Name="InfoLayerText" Foreground="White" TextWrapping="Wrap" Text="{Binding ChartDescription}" Padding="15" Width="440" VerticalAlignment="Center" HorizontalAlignment="Center" />
            </Grid>
        </telerikPrimitives:RadWindow>
    </Grid>
</phone:PhoneApplicationPage>
